<html>
	<head>
		<script src="jquery-1.11.1.js"></script>
		<script>
		$(document).ready(function(){
			$("button").click(function() {
				$("#test").hide(function(){
					// alert("~~~~~"+ $("#test").text() +"~~~~~~")
					// alert("~~~~~"+ $("#text").html() +"~~~~~~")
					alert("~~~~~"+ $("#taaa").val() +"~~~~~~")	//input content

				})
				//$("#div1").fadeIn();
				//$("#div2").fadeIn("slow");
				//$("#div3").fadeIn(3000);
			});
		});
		</script>
	</head>
	<body>
		<h1>this is my first jquery demo</h1>
		<p id="test">hello jquery</p>
		<p id="test">this is my first jqeery</p>
		<div id="div1" style="width:80px;height:80px;display:none;background-color:red;"></div>
		<br>
		<div id="div2" style="width:80px;height:80px;display:none;background-color:green;"></div>
		<br>
		<div id="div3" style="width:80px;height:80px;display:none;background-color:blue;"></div>
		<button type="button">toggle</button>

		<p>name: <textarea type="test" id="taaa" value="jerry"></textarea></p>
	</body>
</html>



<!-- <html>
	<head>
		<script src="jquery-1.11.1.js"></script>
		<script>
		$.noConflict();
		jQuery(document).ready(function(){
		jQuery("button").dblclick(function(){	//双击
		// jQuery("button").mouseover(function(){		//移动鼠标

		jQuery("p").text("jQuery still run");
		});
		});
		</script>
	</head>
	<body>
		<p>this is test line</p>
		<button>jQuery line, you know</button>
	</body>
</html> -->